import 'package:demo/app/widgets/line_horizontal.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import 'package:get/get.dart';

import '../../../theme/app_colors.dart';
import '../../../theme/app_text_theme.dart';
import 'calc_controller.dart';

class CalcView extends GetView<CalcController> {
  const CalcView({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Color_bg,
      appBar: AppBar(
        title: Text('贷款计算器',style: text_title_white),
        backgroundColor: Color_main,
        iconTheme: const IconThemeData(color: Color_white),
      ),
      body: SingleChildScrollView(
        child: Column(
            // crossAxisAlignment : CrossAxisAlignment.start,
            children: [
              SizedBox(height: 25.w),
              // 顶部三个按钮
              Row(
                mainAxisSize : MainAxisSize.min,
                children: [
                  Obx(() => Container(
                    padding: EdgeInsets.symmetric(vertical: 3.w,horizontal: 9.w),
                    decoration: BoxDecoration(
                        color: controller.currentIndex.value == 0 ? Color_main : Color_bg,
                        border: Border.all (color: Color_main,width: 1.w),
                        borderRadius: BorderRadius.only(topLeft: Radius.circular(4.w),bottomLeft: Radius.circular(4.w))
                    ),
                    child: InkWell(
                      onTap: ()=> controller.setCurrentIndex(0),
                      child: Text('商业贷款',style: controller.currentIndex.value == 0 ? text_white_14 : text_main_14),
                    ),
                  )),
                  Obx(() => Container(
                    padding: EdgeInsets.symmetric(vertical: 3.w,horizontal: 9.w),
                    decoration: BoxDecoration(
                      color: controller.currentIndex.value == 1 ? Color_main : Color_bg,
                      border: Border.symmetric(horizontal: BorderSide(color: Color_main,width: 1.w)),
                    ),
                    child: InkWell(
                      onTap: ()=> controller.setCurrentIndex(1),
                      child: Text('公积金贷款',style: controller.currentIndex.value == 1 ? text_white_14 : text_main_14),
                    ),
                  )),
                  Obx(() => Container(
                    padding: EdgeInsets.symmetric(vertical: 3.w,horizontal: 9.w),
                    decoration: BoxDecoration(
                        color: controller.currentIndex.value == 2 ? Color_main : Color_bg,
                        border: Border.all (color: Color_main,width: 1.w),
                        borderRadius: BorderRadius.only(topRight: Radius.circular(4.w),bottomRight: Radius.circular(4.w))
                    ),
                    child: InkWell(
                      onTap: ()=> controller.setCurrentIndex(2),
                      child: Text('组合贷款',style: controller.currentIndex.value == 2 ? text_white_14 : text_main_14),
                    ),
                  )),
                ]
              ),
              SizedBox(height: 25.w),
              Row(
                mainAxisSize : MainAxisSize.min,
                children: [
                  getLeftData(),
                  SizedBox(width: 60.w),
                  getRightData(),
                ]
              ),
              SizedBox(height: 10.w),
              Align(alignment : Alignment.bottomRight,child: Text('（以上结果仅供参考）    ',style: text_grey_12)),
              SizedBox(height: 10.w),
              const LineHorizontal(),

              Row(
                mainAxisSize : MainAxisSize.min,
                children: [
                  SizedBox(width: 15.w),
                  Text('贷款总额',style: text_131732_14),
                  Expanded(
                    child: TextField(
                      textAlign : TextAlign.end,
                      controller: controller.applyMoneyController,
                      cursorColor: Color_grey,
                      cursorHeight: 20.w,
                      style: text_131732_14,
                      keyboardType: TextInputType.number,
                      decoration: InputDecoration(
                        // prefixText: "  ",
                        // isDense: true,
                        // contentPadding: EdgeInsets.symmetric(vertical: 15.w),
                        // counterText: "", // 去掉底部计数
                        enabledBorder:  const UnderlineInputBorder(borderSide:BorderSide.none),
                        focusedBorder:  const UnderlineInputBorder(borderSide:BorderSide.none),
                        hintText: '请输入贷款总额',
                        hintStyle: text_grey_14,
                      ),
                    ),
                  ),
                  Text(' 元',style: text_131732_14),
                  SizedBox(width: 15.w),
                ]
              ),
              const LineHorizontal().marginSymmetric(horizontal: 15.w),
              Row(
                  mainAxisSize : MainAxisSize.min,
                  children: [
                    SizedBox(width: 15.w),
                    Text('年利率',style: text_131732_14),
                    Expanded(
                      child: TextField(
                        textAlign : TextAlign.end,
                        controller: controller.applyMoneyController,
                        cursorColor: Color_grey,
                        cursorHeight: 20.w,
                        style: text_131732_14,
                        keyboardType: TextInputType.number,
                        decoration: InputDecoration(
                          // prefixText: "  ",
                          // isDense: true,
                          // contentPadding: EdgeInsets.symmetric(vertical: 15.w),
                          // counterText: "", // 去掉底部计数
                          enabledBorder:  const UnderlineInputBorder(borderSide:BorderSide.none),
                          focusedBorder:  const UnderlineInputBorder(borderSide:BorderSide.none),
                          hintText: '请输入年利率',
                          hintStyle: text_grey_14,
                        ),
                      ),
                    ),
                    Text(' %',style: text_131732_14),
                    SizedBox(width: 15.w),
                  ]
              ),
              const LineHorizontal().marginSymmetric(horizontal: 15.w),
              Row(
                  mainAxisSize : MainAxisSize.min,
                  children: [
                    SizedBox(width: 15.w),
                    Text('按揭年数',style: text_131732_14),
                    Expanded(
                      child: TextField(
                        textAlign : TextAlign.end,
                        controller: controller.applyMoneyController,
                        cursorColor: Color_grey,
                        cursorHeight: 20.w,
                        style: text_131732_14,
                        keyboardType: TextInputType.number,
                        decoration: InputDecoration(
                          enabledBorder:  const UnderlineInputBorder(borderSide:BorderSide.none),
                          focusedBorder:  const UnderlineInputBorder(borderSide:BorderSide.none),
                          hintText: '请输入贷款总额',
                          hintStyle: text_grey_14,
                        ),
                      ),
                    ),
                    Text(' 元',style: text_131732_14),
                    SizedBox(width: 15.w),
                  ]
              ),



              const LineHorizontal(),
              SizedBox(height: 30.w),
              RawMaterialButton(
                fillColor: Color_main,
                elevation:0,
                highlightElevation:0,
                shape : RoundedRectangleBorder(borderRadius : BorderRadius.all(Radius.circular(8.w))),
                constraints: BoxConstraints.tightFor(width: 110.w, height:40.w),
                child: Text('开始计算',style: text_white_16),
                onPressed: ()=> controller.calc(),
              ),
            ]),
      ),
    );
  }

  // 左侧等额本金的
  Widget getLeftData(){
    return RichText(
      text: TextSpan(
        style: text_grey_12.copyWith(height: 2.2),
        children: [
          TextSpan(text: '等额本金\n', style: text_main_14),
          TextSpan(text: '贷款总数：${controller.applyMoney.value}'),
          TextSpan(text: ' 元\n', style: text_131732_12),

          TextSpan(text: '还款月数：${controller.repaymentMonth.value}'),
          TextSpan(text: ' 月\n', style: text_131732_12),

          TextSpan(text: '首月还款：${controller.firstMonth.value}'),
          TextSpan(text: ' 元\n', style: text_131732_12),

          TextSpan(text: '每月递减：${controller.decrement.value}'),
          TextSpan(text: ' 元\n', style: text_131732_12),

          TextSpan(text: '还款总额：${controller.totalMoney1.value}'),
          TextSpan(text: ' 元\n', style: text_131732_12),

          TextSpan(text: '支付利息：${controller.interest1.value}'),
          TextSpan(text: ' 元', style: text_131732_12),
        ],
      ),
    );
  }

  // 右侧等额本息的
  Widget getRightData(){
    return RichText(
      text: TextSpan(
        style: text_grey_12.copyWith(height: 2.2),
        children: [
          TextSpan(text: '等额本息\n', style: text_main_14),
          TextSpan(text: '贷款总数：${controller.applyMoney.value}'),
          TextSpan(text: ' 元\n', style: text_131732_12),

          TextSpan(text: '还款月数：${controller.repaymentMonth.value}'),
          TextSpan(text: ' 月\n', style: text_131732_12),

          TextSpan(text: '首月还款：${controller.everyMonth.value}'),
          TextSpan(text: ' 元\n', style: text_131732_12),

          const TextSpan(text: ' 注：每月还款相等\n'),

          TextSpan(text: '还款总额：${controller.totalMoney2.value}'),
          TextSpan(text: ' 元\n', style: text_131732_12),

          TextSpan(text: '支付利息：${controller.interest2.value}'),
          TextSpan(text: ' 元', style: text_131732_12),
        ],
      ),
    );
  }
}
